{% extends 'ApplicationBootstrapBundle::layout.html.twig' %}

{% block title %}Sticky Footer and Fixed Top Navbar Example for Bootstrap{% endblock %}
{% block layoutstyle %}
    <link href="{{ asset('bundles/applicationbootstrap/css/examples/navbar_fixed_sticky_footer.css') }}" rel="stylesheet" type="text/css" media="all" />
{% endblock %}

{% block stylesheets %}
    <link href="{{ asset('bundles/applicationbootstrap/css/multilevel-menu/navbar-menu/navbar-menu.css') }}" rel="stylesheet" type="text/css" media="all" />
{% endblock %}

{% block javascripts %}
{% endblock %}

{% block navigation %}
    <!-- Fixed navbar -->
    <nav class="navbar navbar-default navbar-fixed-top" role="navigation">
        <div class="container">
        
            {% include 'ApplicationBootstrapBundle::_navbar.html.twig' %}
        
        </div>
    </nav>
{% endblock %}

{% block body %}
    <div class="container">
        <div class="page-header">
          <h1>Multilevel Menu NavBar</h1>
        </div>
        
		<div class="navbar navbar-default" role="navigation">
		    <div class="container">
		        <div class="navbar-header">
		            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
		                <span class="sr-only">Toggle navigation</span>
		                <span class="icon-bar"></span>
		                <span class="icon-bar"></span>
		                <span class="icon-bar"></span>
		            </button>
		            <a class="navbar-brand" href="#">NavBar</a>
		        </div>
		        <div class="collapse navbar-collapse">
		            <ul class="nav navbar-nav">
		                <li class="active"><a href="#">Home</a></li>
		                <li>
		                    <a href="#" class="dropdown-toggle" data-toggle="dropdown">Menu 1 <b class="caret"></b></a>
		                    <ul class="dropdown-menu multi-level">
		                        <li><a href="#">Action</a></li>
		                        <li><a href="#">Another action</a></li>
		                        <li><a href="#">Something else here</a></li>
		                        <li class="divider"></li>
		                        <li><a href="#">Separated link</a></li>
		                        <li class="divider"></li>
		                        <li><a href="#">One more separated link</a></li>
		                        <li class="dropdown-submenu">
		                            <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown</a>
		                            <ul class="dropdown-menu">
		                                <li><a href="#">Action</a></li>
		                                <li class="dropdown-submenu">
		                                    <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown</a>
		                                    <ul class="dropdown-menu">
		                                        <li class="dropdown-submenu">
		                                            <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown</a>
		                                            <ul class="dropdown-menu">
		                                                <li><a href="#">Action</a></li>
		                                                <li><a href="#">Another action</a></li>
		                                                <li><a href="#">Something else here</a></li>
		                                                <li class="divider"></li>
		                                                <li><a href="#">Separated link</a></li>
		                                                <li class="divider"></li>
		                                                <li><a href="#">One more separated link</a></li>
		                                            </ul>
		                                        </li>
		                                    </ul>
		                                </li>
		                            </ul>
		                        </li>
		                    </ul>
		                </li>
		                <li>
		                    <a href="#" class="dropdown-toggle" data-toggle="dropdown">Menu 2 <b class="caret"></b></a>
		                    <ul class="dropdown-menu">
		                        <li><a href="#">Action</a></li>
		                        <li><a href="#">Another action</a></li>
		                        <li><a href="#">Something else here</a></li>
		                        <li class="divider"></li>
		                        <li><a href="#">Separated link</a></li>
		                        <li class="divider"></li>
		                        <li><a href="#">One more separated link</a></li>
		                        <li class="dropdown-submenu">
		                            <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown</a>
		                            <ul class="dropdown-menu">
		                                <li><a href="#">Action</a></li>
		                                <li><a href="#">Another action</a></li>
		                                <li><a href="#">Something else here</a></li>
		                                <li class="divider"></li>
		                                <li><a href="#">Separated link</a></li>
		                                <li class="divider"></li>
		                                <li class="dropdown-submenu">
		                                    <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown</a>
		                                    <ul class="dropdown-menu">
		                                        <li class="dropdown-submenu">
		                                            <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown</a>
		                                            <ul class="dropdown-menu">
		                                                <li><a href="#">Action</a></li>
		                                                <li><a href="#">Another action</a></li>
		                                                <li><a href="#">Something else here</a></li>
		                                                <li class="divider"></li>
		                                                <li><a href="#">Separated link</a></li>
		                                                <li class="divider"></li>
		                                                <li><a href="#">One more separated link</a></li>
		                                            </ul>
		                                        </li>
		                                    </ul>
		                                </li>
		                            </ul>
		                        </li>
		                    </ul>
		                </li>
		            </ul>
		        </div><!--/.nav-collapse -->
		    </div>
		</div>


    </div> <!-- /container -->
{% endblock %}